Ext.onReady(function(){
    X.store({
        id     : 'storeFacultad',
        fields : [ 'idFacultad', 'nombre' ]
    });

    X.store({
        id     : 'storeCarreras',
        url    : '/recuperacion/ajax-get-carreras',
        fields : [ 'idCarrera','nombre' ]
    });

    X.store({
        id      : 'storeMateria',
        fields: [ 'idMateria','nombre' ]
    });

    X.store({
        id     : 'secStore',
        url    : '/recuperacion/ajax-get-secciones',
        fields: [ 'seccion','seccion' ]

    });

    var materias = X.form.combo  ({
        x:60,
        y:43,
        width:230,
        id:'materia',
        dfield:'nombre',
        vfield:'idMateria',
        storeId: 'storeMateria'
    });
    var cmbSeccion = X.form.combo  ({
        x:350,
        y:43,
        width:60,
        id:'seccion',
        dfield:'seccion',
        vfield:'seccion',
        storeId:'secStore'
    });
    materias.addListener('select',function ( combo, record, index) {
        cmbSeccion.clearValue();
        X.get('secStore').load({
            params:{
                idMateria : record.get('idMateria')
            }
        });
    });
    cmbSeccion.addListener('select',function ( combo, record, index) {
        X.get('storeCarreras').load({
            params:{
                idMateria : materias.getValue(),
                seccion : record.get('seccion')
            }
        });
    });


    var checkboxselection = new Ext.grid.CheckboxSelectionModel();
    var carrerasGrid = X.grid.panel({
        id:'carrerasGrid',
        width: 400,
        height: 120,
        x: 10,
        y: 96,
        storeId: 'storeCarreras',
        selModel: checkboxselection,
        columns: [
            checkboxselection,
            {hidden:true, dataIndex: 'idCarrera',header:'id' },
            {renderer: 'string', dataIndex: 'nombre',header:'Carrera',width:375}
        ]
    });

    X.form.panel({
        id     : 'loadRecuperacionForm',
        height : 365,
        width  : 550,
        items  : [
        X.form.hidden ({
            id:'editorRows'
        }),
        X.form.label  ({
            x:10,
            y:16,
            text:'Facultad:'
        }),
        X.form.combo  ({
            x:60,
            y:13,
            width:230,
            id:'facultad',
            dfield:'nombre',
            vfield:'idFacultad',
            storeId:'storeFacultad'
        }),
        X.form.label  ({
            x:10,
            y:46,
            text:'Materia:'
        }),
        materias,
        X.form.label  ({
            x:300,
            y:46,
            text:'Sección:'
        }),
        cmbSeccion,
        X.form.label  ({
            x:10,
            y:76,
            text:'Carreras:'
        }),
        carrerasGrid,
        X.form.label  ({
            x:10,
            y:256,
            text:'Clase a recuperar:'
        }),
        X.form.date  ({
            x:130,
            y:253,
            id:'clase'
        }),
        X.form.label  ({
            x:300,
            y:256,
            text:'Fecha de recuperación:'
        }),
        X.form.date  ({
            x:430,
            y:253,
            id:'fecha'
        }),
        X.form.label  ({
            x:10,
            y:286,
            text:'Inicio de recuperación:'
        }),
        X.form.time({
            x:130,
            y:283,
            width:60,
            id:'inicio',
            minValue : '6:00 AM',
            maxValue : '11:00 PM',
            format   : 'H:i',
            increment: 1
        }),
        X.form.label  ({
            x:300,
            y:286,
            text:'Fin de recuperación:'
        }),
        X.form.time({
            x:430,
            y:283,
            id:'fin',
            width:60,
            minValue : '6:00 AM',
            maxValue : '11:00 PM',
            format   : 'H:i',
            increment: 1
        }),
        X.form.button ({
            x:220,
            y:320,
            width:80,
            id:'guardar',
            text:'Guardar'
        })]
    });
    
    X.event.button('guardar', function(){


        if(X.get('calcularFin').isDirty()){
            X.ajax({
                url:'/liquidacion/ajax-calcular',
                params:{
                    facultad : X.value('facultad'),
                    materia : X.value('materia'),
                    seccion : X.value('seccion'),
                    clase : X.value('clase'),
                    fecha : X.value('fecha'),
                    inicio : X.value('inicio'),
                    fin : X.value('fin')
                }
                //,afterSuccess:h_calcular_success
                //    afterFailure:h_calcular_failure
            });
        }else{
            X.msg.failure("Debe introducir una fecha de fin.");
        }
    });

    X.win.panel({
        id       : 'creaWindow',
        title    : 'Recuperación de clases',
        modal    : false,
        items    : X.get('loadRecuperacionForm')
    });

    X.get('creaWindow').show();

});

